<template>
  <div class="page">
    <h3>性别: {{userGender}}</h3>
    <h3>进度条 1</h3>
    <process-line :percent="90"></process-line>
    <br />
    <h3>进度条 2</h3>
    <process-circle></process-circle>
    <br />
    <h3>折叠框</h3>
    <collapse-parent-com :firstOpen="false">
      <collapse-com
        v-for="(item,index) in abouts"
        :key="index"
        :title="item.title"
        :content="item.content"
      ></collapse-com>
    </collapse-parent-com>
  </div>
</template>

<script>
import processCircle from "../components/process/ProcessCircle.vue";
import processLine from "../components/process/ProcessLine.vue";
import collapseParentCom from "../components/collapse/CollapseParent.vue";
import CollapseCom from "../components/collapse/Collapse.vue";
export default {
  name: "com",
  components: {
    processCircle,
    processLine,
    collapseParentCom,
    CollapseCom
  },
  props: {},
  data() {
    return {
      abouts: [
        {
          title: "一、「想住」有哪些优势？",
          content:
            "<p style='font-weight:bold;'>1、超高性价比</p>想住卡售价866元，全年民宿免费住。将覆盖全国超60个目的地，超过上千家高端民宿，高端民宿均价超600元。全年不限次入住，1次预订即可回本，多住多赚。<br/><br/><p style='font-weight:bold;'>2、更加人性化的退订政策</p>为了平衡用户的预订体验和库存的关系，想住卡提出了更加友好的退订政策。若您因个人原因无法入住已预订民宿,请务必提前48小时申请取消订单；如您未能提前48小时申请取消订单，平台将扣除15%的保证金作为退订费；如您未申请取消订单且未实际入住,平台将扣除30%保证金。<br/><br/><p style='font-weight:bold;'>3、更多权益支持，兑换权益，无忧购卡</p>想住卡到期若未使用，卡片权益不立即报废。用户可以兑换双宿等价的相关物联网家居产品，所有产品都是能有效提高生活质量的物联网单品。另外，用户可以直接兑换为双宿预订平台的民宿积分，在线支持预订等价民宿。<br/><br/><p style='font-weight:bold;'>14、赏金模式开启，不购想住卡，也可以分享赚收益</p>注册想住卡小程序用户，无需购卡也能通过分享邀请码，邀请朋友购卡，即可分得10%的一级好友返佣。好友再分享，还可获得5%的二级好友返佣。民宿畅快住，分享收益多。<br/><br/>"
        },
        {
          title: "二、会员权限及购卡须知",
          content:
            "1、购买 / 激活并完善个人信息成为「想住」会员后，即可在一年有效期内免费入住平台所有合作民宿，不限房型，不限次数。<br/><br/>2、一经购买，会员资格即生效；会员资格一经生效，概不退换。<br/><br/>3、会员权益仅限本人使用，在房型可住人数限制内（可住人数以各个房型的相关规定为准），您可与亲友共同入住。<br/><br/>4、使用免费入住权益时，您每次预订仅可预订1个房间,最多连续2晚，在办理完退房手续后，方可预订下次行程。<br/><br/>5、提交订单时需预付相应的入住保证金，金额按该房间市场价格(标价)计算。在成功办理退房手续后，保证金将在一个工作日内按原路返回。<br/><br/>6、若您因个人原因无法入住已预订民宿，请务必提前48小时内申请取消订单；如您未能提前48小时内申请取消订单，平台将扣除15%的保证金作为退订费；如您未申请取消订单且未实际入住，平台将扣除30%保证金。<br/><br/>"
        },
        {
          title: "三、相关订房问题？",
          content:
            "1、能保,{证房源的充足吗？<br/>「想住」平台会不定时上新，以保证房源供应。当然，周末与节假日为订房高峰期，可能会出现部分房源紧俏的情况，请合理安排出行时间。<br/><br/>2、会员卡可否转让给亲人/朋友使用？<br/>· 「想住」会员卡相关权益仅限本人使用，不可转让给他人使用。<br/><br/>· 在您本人入住的前提下，您可携带家人朋友入住已预订房间。房间可入住人数以各个房型的相关规定为准。<br/><br/>3、订房后/入住期间可否预订其他行程？<br/>不可以。为保证更多的会员用户享受会员免费入住权益，每张会员卡每次仅能预订1个房间，最多2晚，在成功办理退房手续后，方可预订下次行程。<br/><br/>"
        },
        {
          title: "四、相关订房问题",
          content:
            "呃呃呃呃嗯嗯呃呃呃呃嗯嗯呃呃呃呃嗯嗯呃呃呃呃嗯嗯呃呃呃呃嗯嗯呃呃呃呃嗯嗯呃呃呃呃嗯嗯呃呃呃呃嗯嗯呃呃呃呃嗯嗯呃呃呃呃嗯嗯呃呃呃呃嗯嗯"
        },
        {
          title: "四、相关订房问题",
          content:
            "呃呃呃呃嗯嗯呃呃呃呃嗯嗯呃呃呃呃嗯嗯呃呃呃呃嗯嗯呃呃呃呃嗯嗯呃呃呃呃嗯嗯呃呃呃呃嗯嗯呃呃呃呃嗯嗯呃呃呃呃嗯嗯呃呃呃呃嗯嗯呃呃呃呃嗯嗯"
        }
      ]
    };
  },
  watch: {},
  computed: {
    userGender() {
      return this.$store.getters["user/userGender"];
    }
  },
  methods: {
    fetchUserInfo: function() {
      axios
        .get(this.API.GET_APP_CONST)
        .then(res => {
          this.$store.dispatch("user/updateUserInfo", res.data);
        })
        .catch(err => {
          console.log("fetchUserInfo err:", err);
        });
    },
    fetchUpdateInfo: function() {
      axios
        .get(this.API.POST_GEE_TEST, { loading: true, else: 1 })
        .then(res => {
          this.$store.dispatch("user/updateUserInfo", res.data);
        })
        .catch(err => {
          console.log("fetchUserInfo err:", err);
        });
    }
  },
  created() {},
  mounted() {
    this.fetchUserInfo();
  },
  destroyed() {}
};
</script>
<style lang="scss" scoped>
.page {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
</style>
